import "@/assets/css/mine.scss";
import { Helmet } from "react-helmet-async";
import avatar from "@/assets/images/avatar.jpg";
import address from "@/assets/images/address.png";
import order from "@/assets/images/order.png";
import { Link } from "react-router-dom";
export default function Mine() {
  return (
    <div>
      <Helmet>
        <title>我的</title>
      </Helmet>
      <div className="h-72 bg-top absolute w-screen top-0 left-0"></div>
      <div className="w-11/12 p-3 rounded-lg shadow-sm relative z-10 m-auto bg-white mt-10 ">
        <div className="flex min-h-28 items-center">
          <div className="rounded-full w-20 h-20 overflow-hidden">
            <img className="w-20" src={avatar} alt="" />
          </div>
          <div className="text-xl font-bold text-gray-500 ml-2">刘什么刘</div>
        </div>
      </div>
      <div className="w-11/12 p-3 rounded-lg shadow-sm relative z-10 m-auto bg-white mt-2 ">
        <div className="text-base font-bold text-gray-600">我的工具</div>
        <div className="flex py-3">
          <Link
            to="/address"
            className="w-1/4 flex flex-col justify-center items-center text-gray-600"
          >
            <img className="w-2/5" src={address} alt="" />
            <div>地址管理</div>
          </Link>

          <Link
            to="/orderList"
            className="w-1/4 flex flex-col justify-center items-center text-gray-600"
          >
            <img className="w-2/5" src={order} alt="" />
            <div>订单管理</div>
          </Link>
        </div>
      </div>
    </div>
  );
}
